<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- value   checked   disabled-->
    <!-- <form action="http:///www.baidu.com"  onsubmit="return false"> -->
        <input type="text" placeholder="请输入关键字" id="txt1"> <br><br>
        <input type="password" placeholder="请输入密码" id="pwd"><br><br>
        <input type="radio" name="gender" id="rad"  checked>男 <input type="radio" name="gender">女<br><br>
        <input type="checkbox" id="cbx"> 看书<input type="checkbox" checked>画画<br><br>
        <select id="slt">
            <option value="./images/w.gif"  selected>图片一</option>
            <option value="./images/x.gif">图片二</option>
            <option>图片三</option>
        </select><br><br>
        <textarea id="area" cols="30" rows="10"></textarea><br><br>

        <input type="file" id="file"><br><br>

        <input type="submit" value="获取" id="btn"  >
        <input type="button" value="设置" id="btn1">
    <!-- </form> -->
    <script>

        //1.查
        var txt1= document.getElementById('txt1');
       var pwd= document.getElementById('pwd');
       var rad= document.getElementById('rad');
       var cbx= document.getElementById('cbx');
       var slt= document.getElementById('slt');
       var area= document.getElementById('area');
       var file= document.getElementById('file');
       var btn= document.getElementById('btn');
       var btn1= document.getElementById('btn1');

       //2.加事件获取  
       btn.onclick=function(){
        // value 属性
        var v1= txt1.value;
        console.log(v1);
        var v2= pwd.value;
        console.log(v2,typeof v2);// 字符符串类型
        var v3=slt.value;
        console.log(v3);
        // 能取到选中项的索引号
        var idx= slt.selectedIndex;
        console.log(idx);
       var v4= area.value;
       console.log(v4);
         var v5= file.value;
         console.log(v5);
        var v6 = btn1.value;
        console.log(v6);

        // checked    选中 不是通是value
        // 布尔值  true  false
       var flag=  rad.checked;//true    选中 得到值是true  未选中是false
       console.log(flag);
       var flag1= cbx.checked;
       console.log(flag1);//勾选  得到值是true  未选中是false


        var flag2=  btn1.disabled;// 按钮可用 值是false    不可用是true
        console.log(flag2);


       }



       //3.加事件设置    赋值
       btn1.onclick=function(){
        rad.checked=false;
        cbx.checked=true;
        btn.disabled=true;
        setTimeout(function(){
            btn.disabled=false;
        },3000)

          txt1.value='我是张岩龙'
       }

    </script>
</body>

</html>